<template>
    <div style="position: relative">
      <template  v-if="btnList.length>0">
<!--        校内通知，待阅的页面不要显示流转按钮-->
        <template v-if="otherBtn.length>0&&otherBtn[0]&&(!(row.is_read&&row.type_id==4))">
            <agree-handle-button v-if="otherBtn.length==1" :btn="otherBtn[0]" :title="otherBtn[0].transition_name" :row="row"></agree-handle-button>
            <agree-button v-else-if="otherBtn.length>1" @click="showDialog" title="流转"></agree-button>
        </template>
        <reject-button v-if="rejectBtn" @click="doSomething(rejectBtn)" :title="rejectBtn.transition_name"></reject-button><!--退回-->

        <back-button :row="row"></back-button>
        <over-button v-if="overBtn" @click="doSomething(overBtn)" :title="overBtn.transition_name"></over-button><!--办结-->
        <active-dialog :visible.sync="visible" v-if="visible" ref="active-dialog"  :row="row" :otherBtn="otherBtn"></active-dialog>

        <component :is="eventDialogComponent" v-if="eventDialogVisible" @callBack="eventDialogSubmit"  :visible.sync="eventDialogVisible" :row="row"></component>
      </template>
      <read-button v-if="row.is_read" :id="row.dist_id" :type="row.type_id"></read-button><!--已阅-->
    </div>
</template>
<script>
    import ActiveDialog from "./ActiveDialog";
    import AgreeButton from "./Buttons/AgreeButton";
    import RejectButton from "./Buttons/RejectButton";
    import OverButton from "./Buttons/OverButton";
    import AgreeHandleButton from "./Buttons/AgreeHandleButton";
    import ButtonHandle from "@/mixins/ButtonHandle"
    import ReadButton from "./Buttons/ReadButton";
    import BackButton from "./Buttons/BackButton";
    export default {
        name: "ActiveButton",
        components: {BackButton, ReadButton, AgreeHandleButton,  OverButton, RejectButton, AgreeButton, ActiveDialog},
        mixins:[ButtonHandle],
        data() {
            return {
                visible:false,
                overBtn:undefined,
                rejectBtn:undefined,
                otherBtn:[],
                isRequired:false,
                btn:{},
                eventDialogComponent:null,
                eventDialogVisible:true,
                eventDialogSubmit:()=>{}
            }
        },
        created() {
        },
        watch:{
          btnList(){
            this.getResetBtnsTypeId()
          }
        },
        methods:{
            showDialog(){
                this.visible = !this.visible
            },
            getResetBtnsTypeId(){
              console.log('---this.btnList--',this.btnList)
              console.log('---this.btnList--',this.rejectBtn)
                for(var i=0; i<this.btnList.length; i++){
                    let item = this.btnList[i]
                    if(item.attribute_type_id == 3){
                        this.rejectBtn = item
                    }else if(item.attribute_type_id == 4){
                        this.overBtn = item
                    }else{
                        this.otherBtn.push(item)
                    }
                }
            },
        }
    }
</script>
<style lang="scss" scoped>
    @import "~@/assets/styles/variables.scss";
    .active-button {
        width: 70px;
        height: 70px;
        background-color: $fixedMenuBg;
        position: absolute;
        right: 0px;
        bottom: 40px;
        color: #ffffff;
        border-top-left-radius: 35px;
        border-bottom-left-radius: 35px;

        i {
            padding-left: 25px;
            padding-top: 20px;
            font-size: 24px;
        }
    }
</style>
